<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue数据绑定.html</title>
    <!--导入js package-->
    <script type="text/javascript" src="../01-vue_js/vue.js"></script>
</head>
<body>
<div id="root">
    <!--v-bind-->
    单向数据绑定: <input type="text" v-bind:value="name">
    <br>
    双向数据绑定: <input type="text" v-model:value="name">

    <!--如下代码是错误的，因为v-mode1只能应用在表单类元素（输入类元素)上-->
    <!-- <h2 v-model:x="name">你好啊</h2>-->

</div>

<script type="text/javascript">
    // 关闭开发环境的警告提示
    Vue.config.productionTip = false
    // 创建vue的对象
    new Vue({
        el: '#root', // el用于指定当前Vue实例为哪个容器服务，值通常为css选择器字符串。
        data: {  // data中用于存储数据，数据供e1所指定的容器去使用。 先成为一个对象
            name: "jiale-xiong000",
            address: "上海",
            url: "https://gitee.com/xjl2462612540"
        }
    })
</script>
</body>
</html>